<template>
  <div class="content content43">
    <div>检测条件：温度T：<el-input v-model="form.temperature" class="input-line" />℃；气压p：<el-input v-model="form.pressure" class="input-line" />Kpa</div>
    <div class="innertitle">
      1.静态输出剂量：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>机架角度</td>
        <td>剂量模体规格</td>
        <td>照射野</td>
        <td>SSD</td>
        <td>预设值D<span class="miniFont">0</span>，cGy</td>
        <td>校准因子N<span class="miniFont">X</span></td>
      </tr>
      <tr>
        <td>0°</td>
        <td>55cm×15cm×24cm</td>
        <td>
          <el-radio v-model="form.staticOutputDose.irradiationFieldType" :label="1">40cm×5cm </el-radio><el-radio v-model="form.staticOutputDose.irradiationFieldType" :label="2">10cm×5cm</el-radio>
        </td>
        <td>85cm</td>
        <td><el-input v-model="form.staticOutputDose.presets" class="input-line" /></td>
        <td><el-input v-model="form.staticOutputDose.calibrationFactor" class="input-line" /></td>
      </tr>
    </table>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td rowspan="2">参考点深度S</td>
        <td :colspan="staticOutputDose.table.td+1">剂量模体表面下1.5cm处剂量测量值D<span class="miniFont">1.5</span>，cGy</td>
        <td rowspan="2">校准值DwcGy</td>
        <td rowspan="2">输出剂量偏差Φ%</td>
      </tr>
      <tr>
        <td v-for="index in staticOutputDose.table.td" :key="index">{{index}}</td>
        <td>平均值</td>
      </tr>
      <tr>
        <td>1.5cm</td>
        <td v-for="index in staticOutputDose.table.td" :key="index">
          <el-input v-model="form.staticOutputDose['measuredValue_'+index]" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.staticOutputDose.averageValue" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.staticOutputDose.calibrationValue" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.staticOutputDose.deviation" class="input-line" />
        </td>
      </tr>
    </table>
    <div style="display: flex; align-items: center;">
      <img src="@/assets/images/test_item43/form1_formula1.png" alt="">
      <img src="@/assets/images/test_item43/form1_formula2.png" alt="">
      <img src="@/assets/images/test_item43/form1_formula3.png" alt="">
    </div>
    <div style="display: flex; align-items: center;">
      <img src="@/assets/images/test_item43/form1_formula4.png" alt="">
      <img src="@/assets/images/test_item43/form1_formula5.png" alt="">
      <img src="@/assets/images/test_item43/form1_formula6.png" alt="">
    </div>
    <div class="innertitle">
      2.旋转输出剂量：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td rowspan="2">机架旋转速度，s/圈</td>
        <td :colspan="rotateOutputDose.table.td+1">仪器读数M<span class="miniFont">u</span>，cGy</td>
        <td colspan="2">测量位置输出剂量，cGy</td>
        <td rowspan="2">输出剂量偏差,%</td>
      </tr>
      <tr>
        <td v-for="index in rotateOutputDose.table.td" :key="index">{{index}}</td>
        <td>平均值</td>
        <td>校准值</td>
        <td>计划值</td>
      </tr>
      <tr>
        <td>
          <el-input v-model="form.rotateOutputDose.speed" class="input-line" />
        </td>
        <td v-for="index in rotateOutputDose.table.td" :key="index">
          <el-input v-model="form.rotateOutputDose['readoutValue_'+index]" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.rotateOutputDose.averageValue" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.rotateOutputDose.plannedValue" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.rotateOutputDose.calibrationValue" class="input-line" />
        </td>
        <td>
          <el-input v-model="form.rotateOutputDose.deviation" class="input-line" />
        </td>
      </tr>
    </table>
    <div class="innertitle">
      3.射线质（百分深度剂量，PDD）：<span style="font-weight: normal;"><el-checkbox v-model="form.radiosity.scanningWaterTankMethod">扫描水箱检测法</el-checkbox><el-checkbox v-model="form.radiosity.PhantomMethod">剂量模体检测法</el-checkbox></span>
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>机架角度</td>
        <td>照射野</td>
        <td>SSD</td>
        <td>D<span class="miniFont">10</span>，cGy</td>
        <td>D<span class="miniFont">20</span>，cGy</td>
      </tr>
      <tr>
        <td>0°</td>
        <td>
          <el-radio v-model="form.radiosity.irradiationFieldType" :label="1">40cm×5cm </el-radio><el-radio v-model="form.radiosity.irradiationFieldType" :label="2">10cm×5cm</el-radio>
        </td>
        <td>85cm</td>
        <td><el-input v-model="form.radiosity.d10" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.d20" class="input-line" /></td>
      </tr>
    </table>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td colspan="3">PDD<span class="miniFont">10</span>，%</td>
        <td colspan="3">PDD<span class="miniFont">20</span>，%</td>
        <td colspan="3">PDD<span class="miniFont">20</span>/PDD<span class="miniFont">10</span>，%</td>
      </tr>
      <tr>
        <td>计算值</td>
        <td>计划值</td>
        <td>偏差</td>
        <td>计算值</td>
        <td>计划值</td>
        <td>偏差</td>
        <td>计算值</td>
        <td>计划值</td>
        <td>偏差</td>
      </tr>
      <tr>
        <td><el-input v-model="form.radiosity.calculatedValuePDD_10" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.plannedValuePDD_10" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.deviationPDD_10" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.calculatedValuePDD_20" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.plannedValuePDD_20" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.deviationPDD_20" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.calculatedValuePDD" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.plannedValuePDD" class="input-line" /></td>
        <td><el-input v-model="form.radiosity.deviationPDD" class="input-line" /></td>
      </tr>
    </table>
    <div class="innertitle">
      4.射野截面剂量分布：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>机架角度</td>
        <td>照射野</td>
        <td>SSD</td>
        <td>射线能量</td>
        <td>参考点深度</td>
      </tr>
      <tr>
        <td>0°</td>
        <td>
          <el-radio v-model="form.doseDistribution.irradiationFieldType" :label="1">40cm×5cm </el-radio><el-radio v-model="form.doseDistribution.irradiationFieldType" :label="2">10cm×5cm</el-radio>
        </td>
        <td>85cm</td>
        <td>6MV</td>
        <td>1.5cm</td>
      </tr>
    </table>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td rowspan="2">射野横向截面对称性，%</td>
        <td colspan="3">射野纵向截面宽度偏差，mm</td>
      </tr>
      <tr>
        <td>测量射野半高宽</td>
        <td>归一射野半高宽</td>
        <td>偏差</td>
      </tr>
      <tr>
        <td><el-input v-model="form.doseDistribution.symmetry" class="input-line" /></td>
        <td><el-input v-model="form.doseDistribution.halfWidthMeasure" class="input-line" /></td>
        <td><el-input v-model="form.doseDistribution.halfWidthNormalization" class="input-line" /></td>
        <td><el-input v-model="form.doseDistribution.deviation" class="input-line" /></td>
      </tr>
    </table>
    <div class="innertitle">
      5.多叶准直器（MLC）横向偏移：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>SAD</td>
        <td>第一次照射条件</td>
        <td>第二次照射条件</td>
      </tr>
      <tr>
        <td>85cm</td>
        <td>机架角度：0°，打开32～33和27～28叶片</td>
        <td>机架角度：180°，打开27～28叶片</td>
      </tr>
    </table>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td rowspan="2">多叶准直器（MLC）横向偏移</td>
        <td rowspan="2">
          <div style="width: 240px; position: relative;display: flex;justify-content: space-around;margin: auto;">
            <div class="offsetPlot" style="height: 120px;width: 40px;"></div>
            <div class="offsetPlot" style="height: 120px;width: 40px;"></div>
            <div class="offsetPlot" style="height: 120px;width: 40px;"></div>
            <div style="width: 160px;" class="offsetLine"></div>
          </div>
        </td>
        <td>偏移结果，mm</td>
      </tr>
      <tr>
        <td><el-input v-model="form.offset.result" class="input-line" /></td>
      </tr>
    </table>
    <div class="innertitle">
      6.激光灯指示准确性：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td rowspan="2">绿激光灯指示虚拟等中心的准确性</td>
        <td>模体检测法</td>
        <td class="multipleInput">
          X轴方向偏移：<el-input v-model="form.indicationAccuracy.shiftingXPhantom" class="input-line" />mm  Z轴方向偏移：<el-input v-model="form.indicationAccuracy.shiftingYPhantom" class="input-line" />mm
        </td>
      </tr>
      <tr>
        <td>胶片检测法</td>
        <td class="multipleInput">
          Y轴方向偏移：<el-input v-model="form.indicationAccuracy.shiftingYFilm" class="input-line" />mm
        </td>
      </tr>
      <tr>
        <td rowspan="2">红激光灯指示准确性</td>
        <td>SAD：85cm</td>
        <td>红激光灯与绿激光灯是否重合：<el-radio v-model="form.indicationAccuracy.coincide" :label="true">是</el-radio><el-radio v-model="form.indicationAccuracy.coincide" :label="false">否</el-radio></td>
      </tr>
      <tr>
        <td>SAD：65cm～105cm</td>
        <td class="multipleInput">
          红激光灯与绿激光灯重合偏差：<el-input v-model="form.indicationAccuracy.coincideDeviation" class="input-line" />mm
        </td>
      </tr>
    </table>
    <div class="innertitle">
      7.治疗床的移动准确性：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>负重条件</td>
        <td>治疗床运动条件</td>
        <td colspan="2">运动前后虚拟等中心点位置偏移，mm</td>
      </tr>
      <tr>
        <td rowspan="3">70kg</td>
        <td rowspan="3">进出20cm和升降20cm</td>
        <td class="multipleInput">X轴方向偏移：<el-input v-model="form.moveAccuracy.shiftingX" class="input-line" /></td>
        <td rowspan="3"><el-input v-model="form.moveAccuracy.result" class="input-line" /></td>
      </tr>
      <tr>
        <td class="multipleInput">Y轴方向偏移：<el-input v-model="form.moveAccuracy.shiftingY" class="input-line" /></td>
      </tr>
      <tr>
        <td class="multipleInput">Z轴方向偏移：<el-input v-model="form.moveAccuracy.shiftingZ" class="input-line" /></td>
      </tr>
    </table>
    <div class="innertitle">
      8.床移动与机架旋转同步性：
    </div>
    <table border="1" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>照射野</td>
        <td>机架旋转速度</td>
        <td>机架旋转圈数</td>
        <td>治疗床运动速度</td>
        <td>叶片打开方式</td>
      </tr>
      <tr>
        <td>10cm×1cm</td>
        <td>20s/圈</td>
        <td>13圈</td>
        <td>0.5mm/s</td>
        <td>第2、7和12圈中机架为270～90°</td>
      </tr>
    </table>
    <table border="1" cellspacing="0" cellpadding="0" align="center" class="notMaxWith">
      <tr>
        <td rowspan="2">床移动与机架旋转同步性</td>
        <td rowspan="2">
          <div style="width: 450px;height: 150px; position: relative;display: flex;justify-content: space-around;margin: auto;align-items: center;">
            <div class="offsetPlot" style="height: 120px;width: 20px;">
              <div style="width: 40px;" class="offsetFontTop">第2圈</div>
              <div style="width: 130px;" class="multipleInput offsetFontRightTop">测量值：<el-input v-model="form.synchronism.measuredValue_2" class="input-line" />mm</div>
              <div style="width: 130px;" class="offsetFontRightBottom">标称值：50mm</div>
            </div>
            <div class="offsetPlot" style="height: 120px;width: 20px;">
              <div style="width: 40px;" class="offsetFontTop">第7圈</div>
              <div style="width: 130px;" class="multipleInput offsetFontRightTop">测量值：<el-input v-model="form.synchronism.measuredValue_7" class="input-line" />mm</div>
              <div style="width: 130px;" class="offsetFontRightBottom">标称值：50mm</div>
            </div>
            <div class="offsetPlot" style="height: 120px;width: 20px;">
              <div style="width: 50px;" class="offsetFontTop">第12圈</div>
            </div>
            <div style="width: 290px;" class="offsetLine"></div>
          </div>
        </td>
        <td>偏移结果，mm</td>
      </tr>
      <tr>
        <td><el-input v-model="form.synchronism.result" class="input-line" /></td>
      </tr>
    </table>
  </div>

</template>

<script>
  import {getInfoById, postInfo} from '@/api/testItem/item43'
export default{
  name:"testItem43",
  data(){
    return{
      initFlag:false,
      "sdd": {
        action:'saveInfo',
        flag:true,
        loading:false,
        notNumber:[],
        intNumber:[],
        like:false
      },
      staticOutputDose:{
        table:{
          td:5
        },
        action:'staticOutputDose',
        flag:true,
        loading:false,
        notNumber:['irradiationFieldType'],
        intNumber:[],
        like:false
      },
      rotateOutputDose:{
        table:{
          td:5
        },
        action:'rotateOutputDose',
        flag:true,
        loading:false,
        notNumber:[],
        intNumber:[],
        like:false
      },
      "radiosity": {
        action:'radiosity',
        flag:true,
        loading:false,
        notNumber:['scanningWaterTankMethod','PhantomMethod','irradiationFieldType'],
        intNumber:[],
        like:false
      },
      "doseDistribution": {
        action:'distribution',
        flag:true,
        loading:false,
        notNumber:['irradiationFieldType'],
        intNumber:[],
        like:false
      },
      "offset": {
        action:'offset',
        flag:true,
        loading:false,
        notNumber:[],
        intNumber:[],
        like:false
      },
      "indicationAccuracy": {
        action:'indicationAccuracy',
        flag:true,
        loading:false,
        notNumber:['coincide'],
        intNumber:[],
        like:false
      },
      "moveAccuracy": {
        action:'moveAccuracy',
        flag:true,
        loading:false,
        notNumber:[],
        intNumber:[],
        like:false
      },
      "synchronism": {
        action:'synchronism',
        flag:true,
        loading:false,
        notNumber:[],
        intNumber:[],
        like:false
      },
      "form": {
        "itemsId": 0,
        "resultId": 0,
        "temperature": 0.0,
        "pressure": 0.0,
        "staticOutputDose": {
        },
        "rotateOutputDose": {
        },
        "radiosity": {
        },
        "doseDistribution": {
        },
        "offset": {
        },
        "indicationAccuracy": {
        },
        "moveAccuracy": {
        },
        "synchronism": {
        }
      }
    }
  },
  props: {
  	// tab栏
    activeNameEquipment: {
  		type: String,
      default: "0",
    },
  	// 基本信息数据
    basicForm: {
  		type: Object,
      default: () => {
  			return {}
  		},
    },
  },
  methods:{
    //修改数据
    setData(name,data){
      this.form[name] = data ? data : (this[name] ? {}:null);
    },
    //表单修改提交后端
     postForm(param,name){
       param['itemsId'] = this.form.itemsId;
       if(name == 'tomographySensitivity' || name == 'scatterFraction'){
         let activityTime = param.activityHour ? param.activityHour :'';
         activityTime += ":";
         activityTime += param.activityMinute ? param.activityMinute :'';
         param['activityTime'] = activityTime;
         let startCollectionTime = param.startCollectionHour ? param.startCollectionHour :'';
         startCollectionTime += ":";
         startCollectionTime += param.startCollectionMinute ? param.startCollectionMinute :'';
         param['startCollectionTime'] = startCollectionTime;
       }
       this.$emit("loadingchange", true);
    	 postInfo(param,this[name].action).then(res=>{
    		 this.$emit("loadingchange", false);
    		 if(res.code == 200){
    			 this[name].flag = false;
    			 if(name != 'sdd'){
    				this.setData(name,res.data);
    			 }
    		 }
    	 })
    },
    validateType(arr,keys,obj){
    	if(obj.like){
    		for(let i=0;i<arr.length;i++){
    			if(keys.indexOf(arr[i]) != -1){
    				return true;
    			}
    		}
    		return false;
    	}else{
    		if(arr.indexOf(keys) != -1){
    			return true;
    		}
    		return false;
    	}
    },
     //数据验证
     validateData(newName,myName){
    	 if(!this[myName].noClear){
    		clearTimeout(this[myName].loading);
    	 }else{
    		 this[myName].noClear = false;
    	 }
       let regNumber = /^[-]?\d*([.](\d+))?$/;//小数验证正则
       let regRepNumber = /[^-?\d.,]/g;//将除小数外的符号消除正则
       let regInt = /^\d*$/;//整数验证正则
       let regRepInt = /[^-?\d,]/g;//将除小数外的符号消除正则
       let reg,regRep;
       let repStr = '';
    	 let intResult
       if(JSON.stringify(newName) != '{}'){
         //遍历该对象所有字段进行验证
         for(let keys in newName){
           //数字验证环节
    			 if((typeof newName[keys] == 'string') ||  (typeof newName[keys] == 'number')){
    				if(newName[keys] && !this.validateType(this[myName].notNumber,keys,this[myName])){
    					intResult = this.validateType(this[myName].intNumber,keys,this[myName]);
    					reg = intResult ? regInt:regNumber;
    				  let bool = !reg.test(newName[keys]);
    				  if(bool){
    						setTimeout(()=>{
    							intResult = this.validateType(this[myName].intNumber,keys,this[myName]);
    							regRep = intResult ? regRepInt:regRepNumber;
    									repStr = newName[keys] + '';
    							repStr =  repStr.replace(regRep,'');
    							if(repStr != (newName[keys]+'')){
    								if(!this[myName].noClear){
    									this[myName].noClear = true;
    								}
    								newName[keys] = repStr;
    							}
    						},100);
    						if(this[myName].flag){
    						 this[myName].flag = false;//如果数字验证不通过不需要请求后端
    						}
    				  }
    				}
    			 }
         }
    		 this.isPost(newName,myName);
       }
     },
     isPost(newName,myName){
    	 if(this[myName].flag){//是否请求后端判断
    	  let postBody = {};
    	  for(let i in newName){
    	    if(newName[i] !== null && newName[i] !== undefined){
    	      postBody[i] = newName[i];
    	    }
    	  }
    	  if(JSON.stringify(postBody) != '{}'){
    			this[myName].loading = setTimeout(()=>{
    				this.postForm(postBody,myName);
    			},800)
    	  }
    	 }else{
    		 this[myName].flag = true;
    	 }
     },
  },
  watch:{
    activeNameEquipment: {
      handler(val) {
        this.$nextTick(()=>{
          let resultId = this.basicForm.resultId;
          getInfoById(resultId).then(response => {
            if(response.code == 200){
              let data = response.data;
              for(let keys in data){
                this.setData(keys,data[keys]);
              }
               setTimeout(()=>{
                 this.initFlag = true;
               },300)
            }
          }).catch((response) => {
             this.$emit("loadingchange", true);
           });
           });
      },
      deep: true,
      immediate: true
    },
    "form.staticOutputDose":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'staticOutputDose');
       }
      },
      deep:true,
      immediate: true
    },"form.rotateOutputDose":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'rotateOutputDose');
       }
      },
      deep:true,
      immediate: true
    },"form.radiosity":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'radiosity');
       }
      },
      deep:true,
      immediate: true
      },"form.doseDistribution":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'doseDistribution');
       }
      },
      deep:true,
      immediate: true
    },"form.offset":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'offset');
       }
      },
      deep:true,
      immediate: true
    },"form.indicationAccuracy":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'indicationAccuracy');
       }
      },
      deep:true,
      immediate: true
      },"form.moveAccuracy":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'moveAccuracy');
       }
      },
      deep:true,
      immediate: true
    },"form.synchronism":{
      handler(newName, oldName) {
       if(this.initFlag){
        this.validateData(newName,'synchronism');
       }
      },
      deep:true,
      immediate: true
    },"form.temperature":{
        handler(newName, oldName) {
          if(this.initFlag){
           this.validateData(this.form,'sdd');
          }
        },
        immediate: true
      },
      "form.pressure":{
        handler(newName, oldName) {
          if(this.initFlag){
           this.validateData(this.form,'sdd');
          }
        },
        immediate: true
      },
  }
}
</script>

<style lang="scss" scoped>
  @import '../content.scss';

  .miniFont {
    font-size: 10px;
  }

  .miniFontCenter {
    margin-top: 8px;
  }

  .content43 {
    padding-inline: 0 !important;
    .notMaxWith{
      td{
        max-width: none;
      }
    }
    table {
      width: 100%;

      td {
        max-width: 100px;

        ::v-deep .el-checkbox__label {
          white-space: break-spaces;
        }
      }
      .offsetFontTop{
        width: 40px;
        font-size: 15px;
        position: absolute;
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
      }
      .offsetFontRightTop{
        width: 130px;
        position: absolute;
        top: 35px;
        left: 18px;
      }
      .offsetFontRightBottom{
        width: 130px;
        position: absolute;
        bottom: 35px;
        left: 16px;
      }
      .offsetPlot{
        background: rgb(217, 217, 217);
        border: 1px solid #000;
        position: relative;
      }
      .offsetPlot::after{
        content: '';
        width: 10px;
        height: 10px;
        background: #000;
        border-radius: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
      }
      .offsetLine{
        height: 2px;
        background: #000;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
      }

      .el-input {
        width: 100% !important;
      }

      .multipleInput {
        .el-input {
          width: 50px !important;
        }
      }
    }

    .innertitle {
      display: block;
      margin-left: 0;
    }

    .table1 {
      .el-radio {
        display: flex;
        align-items: center;
      }
    }

    #hearderTR td:nth-child(7) {
      display: none;
    }
  }
</style>
